<html>

<head>
    <meta charset="utf-8">
    <meta name="author" content="Ajj">
    <title>index</title>    
    <script src="jquery-3.1.1.js"></script>
    <style>

    </style>
</head>

<body>
    <div id="test-jquery">
        <p id="para-1" class="color-red">JavaScript</p>
        <p id="para-2" class="color-green">Haskell</p>
        <p class="color-red color-green">Erlang</p>
        <p name="name" class="color-black text">Python</p>
        <form class="test-form" target="_blank" action="#0" onsubmit="return false;">
            <legend>注册新用户</legend>
            <fieldset>
                <p><label>名字:<input name="name"></label></p>
                <p><label>邮件:<input name="email"></label></p>
                <p><label>口令:<input name="password" type="password" class="text"></label></p>
                <p><button type="submit">注册</button></p>
            </fieldset>
        </form>
    </div>
</body>

</html>
<script>
    /*练习:使用jQuery选择器分别选出指定元素:
    仅选择JavaScript
    仅选择Erlang
    同时选择JavaScript和Erlang
    选择所有 <p>
    选择名字为name的input
    同时选择名字为邮email和name的input
	*/

    console.dir($('#para-1'));
    console.dir($('#test-jquery .color-red.color-green'));
    console.dir($('.color-red'));
    console.dir($('p'));
    console.dir($(':input[name=name]'));
    console.dir($(':input[name!=password][type!=submit]'));
</script>